@media screen and (max-width: 1199px){
    .msg-nav a:nth-of-type(4):hover{background: url("../images/mobile-top.png") #547473 no-repeat top 19px center;}
    .news-more .more{
        display: block;
    }
    .pc-nav{
        display: none !important;
    }
    .page-t{
        display: none;
    }
    .pro-list .series li.active, .pro-list .series li:hover{
        background: unset;
    }
    .msg-nav a:nth-of-type(2) img{
        display: none;
    }
    header .h{
        padding: 0 10px;

        align-items: center;

    }
    .ziLanmu{
        display: none;
    }
    .nav-list{
       padding:0;
        display: none;
        position: fixed;
        top: 120px;
        width: 100%;
        height: 100%;
        z-index: 99;
        background: #fff;
        overflow-y: scroll;
    }
    .function-button{
        display: flex;
    }
    header .h .tel{
        display: none;
    }
    header .h{
        height: 100%;
    }

    header .hea{
        border: none;
        height: 120px;
    }
    .h-nav dl .dd-box{
        display: none;
    }
    .h-nav dl{
        width: 100%;
    }
    .h-nav dl dd{
        position: relative;
    }

    .h-nav dl dd{
        display: block;
        position: relative;
    }
    .h-nav dl dt span{
        display: inline-block;
        width: 30px;
        height: 30px;
        background: url("../images/jia.png") no-repeat center center;
        background-size: contain;
        transition: .5s ease all;
        margin-right: 40px;
    }
    .h-nav dl dt span.active{
        background: url("../images/jian.png") no-repeat center center;
    }
    .h-nav dl dt span:before{
        transform: rotateZ(90deg);
    }
    .h-nav{
        padding: 0;
    }
    .h-nav dl dd a{
        display: block;
        color: #747474;
        font-size: 28px;
    }
    .h-nav dl dd:nth-of-type(1){
        margin-top: 20px;
    }
    .h-nav dl dd{
        padding:10px 70px;
        position: relative;
    }
    .h-nav dl dd a:before{
        content: "";
        width: 8px;
        height: 8px;
        background: #707070;
        border-radius:50% ;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 56px;
    }
    .banner {
        margin-top: 120px;
    }
    .banner  .swiper-slide,
    .banner2  .swiper-slide{
        padding-bottom:100% ;
    }

    .h-nav .search input{
        width: 90%;
        height: 100px;
        border-radius: unset;
        margin: 0 auto;
        display: block;
        margin-bottom: 10%;
    }
    .h-nav .search h1{
        display: block;
        text-align: center;
        font-size: 48px;
        color: #e62129;
        font-weight: bold;
        text-transform: uppercase;
        margin-bottom: 16%;
    }
    .h-nav .search button{
        position: unset;
        display: block;
        margin: 0 auto;
        background: #547473;
        height: 100px;
        width: 90%;
        font-size: 36px;
        border-radius: unset;
        font-weight: bold;
        text-transform: uppercase;

    }
    .h-nav .search .close-2{
        display: block;
        width: fit-content;
        margin: 0 auto;
        padding: 0 20px;
    }
    .h-nav .search .close-2 img{
        display: block;
        margin: 0 auto;
    }
    .h-nav .search .close-2 p{
        text-align: center;
        font-size: 32px;
    }
    .banner  .swiper-slide img,
    .banner2  .swiper-slide img{
        display: block;
        position: absolute;
        object-fit: cover;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
    }

    .h-nav ul{
        color: #383f47;
        display: block;
        width: 100% ;
    }
    .h-nav dt>a{
        font-size: 36px;
        width: 100%;
        padding: 30px 6%;
        color: #383f47;
        font-weight: normal;
        display: block;
    }
    .h-nav dt a:before{
        display: none;
        color: #383f47;
    }
    .h-nav dt.active {
        background: unset;
    }
    .h-nav dt.active a{
        color:unset;
    }


    .h-nav .search{
        position: fixed;
        top: 120px;
        left: 0;
        background: #fff;
        width: 100%;
        height: 100%;
        z-index: 9999;
        padding: 10%;
        /*display: none;*/
        transform: scale(0,0);
        opacity: 0;
        transition: 0.3s ease all;
    }
    .h-nav .search .find{
         display: block;
        margin: 0 auto;
     }
    .h-nav .search.active{
        transform: scale(1,1);
        opacity: 1;
    }
    .h-nav dt{
        width: 100%;
        padding: 0;
        border-bottom: 1px solid #cecece;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .counter_item{
        width: 50%;
        margin-bottom: 20px;
    }
    .counter_list{
        flex-wrap: wrap;
    }
    .slide1{
        padding: 50px;
    }
    .int .txt ul{
        display: none;
    }
    .int{
        display: block;
    }
    .int .txt{
        width: 100%;
    }
    .int .pic{
        width: 100%;
    }
    .slide2 .pro-type ul{
        justify-content: flex-start;
    }
    .slide2 .pro-type li{
        flex: unset;
        width: 50%;
        padding-bottom: 60%;
    }
    .slide2 .pro-type ul{
        flex-wrap: wrap;
    }
    .art-lacquer .dt{
        display: block;
    }
    .art-lacquer .type{
        width: 100%;
    }
    .art-lacquer .box1{
        padding: 9% 0 8% 0;
    }
    .ext .box1{
        padding: 9% 0 8% 0;
    }
    .art-lacquer .box2{
        display: none;
    }
    .art-lacquer .box3{
        padding: 0;
        height: auto;
    }
    .art-lacquer .box3 ul li{
        width: 24%;
        padding-bottom: 24%;
        position: relative;
    }
    .art-lacquer .box3 ul li a{
        position: absolute;
        left: 0;
        top: 0;
    }
    .art-lacquer .case{
        width: 100%;
    }
    .art-lacquer .case .c{
        height: auto;
        padding-bottom: 100%;
    }
    .art-lacquer .case .c:last-of-type{
        display: none;
    }
    .art-lacquer .pro ul li{
        display: none;
        height: auto;
    }
    .art-lacquer .pro{
        width: 100%;
    }
    .art-lacquer .pro ul li:nth-of-type(1),
    .art-lacquer .pro ul li:nth-of-type(2){
        display: block;
        width: 49%;
        padding-bottom: 49%;
        position: relative;
    }
    .art-lacquer .pro ul li a{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    /*.ext{*/
        /*background:none;*/
    /*}*/
    .news-center .box2{
        display: none;
    }
    .news-center .box1{
        width: 100%;
    }
    .tuwen{
        width: 100%;
    }
    .news-center{
        padding: 60px 40px;
    }
    .news-center .tuwen h3{
        color: #5b7877;
    }
    .link-list{
        display: none;
    }
    .icp .max-width-12{
        display: block;
    }
    .icp{
        background: none;
        padding: 0 40px;
    }
    .friendship .max-width-12{
        display: block;
    }
    .friendship .link{
        width: 100%;
    }
    .friendship{
        border: none;
        width: 100%;
    }
    footer{
        display: flex !important;
        flex-direction: column-reverse;
    }
    .icp h2{
        font-size: 36px;
        color: #fff;
        margin-bottom:50px;
        font-weight: bold;
    }
    .icp p{
        font-size: 28px;
        color: #fff;
    }
    .friendship{
        border-top:1px solid #bfbfbf;
        padding-top: 20px;
    }
    .friendship .max-width-12{
        padding: 0 20px;
    }
    .friendship .link{
        padding-bottom: 20px;
        border: none;
        border-bottom: 1px solid rgba(255,255,255,0.3);
    }
    .friendship ul{
        padding: 0;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 10px 0;
    }
    .friendship ul li{
        width: 25%;
        margin: 4px 0;
    }
    .friendship ul li a{
        display: inline-block;
    }
    .friendship .link p{
        display: none;
    }
    .friendship .link h3{
        font-size: 28px;
    }
    .friendship ul li a{
        font-size: 28px;
    }
    .msg-nav{
        display: flex;
        top: 100%;
        left: 0;
        height: fit-content;
        transform: translateY(-100%);
    }
    .msg-nav a{
        background-size: 30px !important;
        width:25%;
        border-right: 1px solid #f1f5f3;
        margin-bottom: 0;
        height: 80px;
        padding-top: 50px;
        font-size: 14px;
        opacity: 1;
    }

    .msg-nav{
        border:1px solid #f1f5f3;
        width: 100%;


    }
    .msg-nav a:nth-of-type(1){
        background:url("../images/mobile-tel.png") #547473 no-repeat top 12px center;
        display: block;
    }
    .msg-nav a:nth-of-type(2){
         background:url("../images/mobile-wx.png") #547473 no-repeat top 12px center;
     }
    .msg-nav a:nth-of-type(3){
        background:url("../images/mobile-qq.png") #547473 no-repeat top 12px  center ;
    }
    .msg-nav a:nth-of-type(4){
        background:url("../images/mobile-top.png") #547473 no-repeat top 19px  center ;
        color: #fff;
        border-right: none;
    }
    footer{
        margin-bottom: 80px;
    }
    .wx-code{
        background: rgba(0,0,0,0.5);
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: fixed;
        z-index: 1000;
        display: none;
    }
    .wx-code .box1{
        width: 80%;
       left: 10%;
        background:#fff;
        border-radius: 20px;
        position: absolute;
        padding-bottom: 10%;
        bottom: 20%;
        border: none;
    }
    .wx-code .box1:before{
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border: 20px solid #fff;
        border-top-color: #fff;
        border-bottom: none;
        border-left-color: transparent;
        border-right-color: transparent;
        top: 99%;
        left: 25%;
    }
    .wx-code .box1 h1{
        font-size:48px;
        text-align: center;
        text-transform: uppercase;
        font-weight: bold;
        clear: both;
        margin-bottom:2%;
    }
    .wx-code .box1 h2{
        font-size: 36px;
        text-align: center;
        margin-bottom: 4%;
    }
    .wx-code .box1 img{
        margin: 0 auto;
        display: block;
        width: 60%;
        margin-bottom: 3%;
    }
    .wx-code .box1 p{
        font-size: 32px;
        color: #747474;
        text-align: center;

    }
    .wx-code .close-w{
        display: inline-block;
        right: 20px;
        top: 20px;
        background: url("../images/close3.png") no-repeat center center;
        background-size: contain;
        width: 40px;
        height: 40px;
        text-align: right;
        float: right;
        margin-right: 20px;
        margin-top: 20px;
    }
    .head-bg{
        margin-top: 120px;
    }
    .u-pos{
        padding: 0 20px;
        padding-bottom: 10px;
        border-bottom: 1px solid #e7e7e7;
        margin-bottom: 0;
    }
    .pro-list .type li{
        width: 25%;
        margin-right: 0;
        justify-content: start;
        background: url("../images/tuliao01.png") no-repeat left center;
        background-size: 24px;
        padding-top: 10px;
        padding-left: 30px;
    }
    .pro-list .type li a{
        font-size: 14px;
    }
    .pro-list .type li:before{
        display: none;
    }
    .pro-list .type{
        justify-content: flex-start;
        flex-wrap: wrap;
        position: relative;
    }
    .open-list{
        display: block;
       width: 30px;
        background:url("../images/arrow-d.png")  no-repeat center center;
        background-size: 18px;
        height: 42px;
        position: absolute;
        right: 0;
        top: 0;
    }
    .pro-list .series{

        padding:0 2% ;
    }
    .pro-list .series li{
        padding: 0;
        margin: 0 ;
        background: none;
        width: 25%;

    }
    .pro-list .series li a{
        font-size: 14px;
        text-align: center;
        width: 100%;
        padding: 10px 0;
        border-radius: none;
        background: #547473;
        border-right: 1px solid #fff;
        color: #fff;
        border-bottom: 1px solid #fff;
        display: block;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .pro-list .series li.active a{
        background: #547473;
        color: #fff;
    }
  
    .icp h2{
        display: block;
    }
    .online-message{
        display: flex;
        flex-direction: column-reverse;
    }
    .online-message .box2 .tit{
        display: none;
    }
    .online-message .box2>p{
        display: none;
    }
    .online-message{
        padding: 0 20px;
    }
    .online-message .box2 .txt{
        border: none;
    }
    .online-message .box1{
        flex-direction: column-reverse;
        border: none;
        box-shadow:none;
    }
    .online-message .box2{
        margin-bottom: 0;
    }
    .online-message .box1{
        padding: 0;
    }
    .online-message .box1 form .yanz{
        width: 100%;
    }
    .online-message .code{
        width: 100%;
        background: #fff;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
    .online-message .code{
        padding-top: 0;
    }
    .online-message .box1>h1,
    .online-message .box1>p{
        display: block;
    }
    .online-message .box1>h1{
        font-size: 30px;
        color: #547473;
        padding: 10px 0;
        margin: 0;
        padding-left: 75px;
        background: url("../images/tousu.png") no-repeat center left;
        background-size:contain;
        margin-bottom: 10px;
    }
    .online-message .box1>p{
        font-size: 16px;
    }
    .online-message .box1>p{
        margin-bottom: 20px;
    }
    .online-message .box1 form{
        width: 100%;
    }
    .online-message .box1 .group{
        flex-wrap: wrap;
    }
    .online-message .box1 .group:nth-of-type(2) label{
        margin-bottom: 10px;
    }
    .online-message .box1 .group:nth-of-type(2) h4{
        margin-bottom: 10px;
    }
    .online-message .box1 .group:last-of-type{
        display: block;

    }
    .online-message .box1 .group:last-of-type h4{
        margin-bottom: 20px;

    }
    .online-message .box1 .group:last-of-type h1{
        width: 20%;
        flex-wrap: nowrap;
        text-wrap: normal;
        white-space: nowrap !important;
    }
    .online-message .group button{
        width: 50%;
        margin: 0 auto;
        margin-top: 10px;
        display: block;
    }


    .online-message>h1{
        display: none;
    }
    .online-message .box1{
        margin-bottom: 20px;
    }
    .news-list li .pic{
        width: 36%;
    }
    .news-detail .rside{
        display: none;
    }
    .news-detail .main{
        width: 100%;
    }
    .news-detail{
        padding: 0 20px;
    }
    .news-list li.active, .news-list li:hover {
        box-shadow: none;
    }
    .news-detail .main h2{
        text-align: center;
    }
    .news-detail .main .shale{
        display: block;
    }
    .news-detail .main .shale p{
        text-align: center;
    }
    .news-detail .main .shale .bdsharebuttonbox{
        justify-content: center;
        display: flex;
    }
    .painting-join{
        padding: 0 20px;
    }
    .painting-join .box1{
        background: #fff;
        padding:40px 20px;
    }
    .painting-join .box2 .type{
        display: block;
    }
    .painting-join .box2 .type ul{
        display: flex;
        flex-wrap: wrap;
    }
    .painting-join .box2 .type li{
        width: 33.33%;
        margin: 0;
    }
    .painting-join .box2 .type .more{
        margin: 0 auto;
        display: block;
        width: 40%;
        background: #547473;
        text-align: center;
        color: #fff;
    }
    .painting-join .box2 .type .more span{
        background: #fff;
        color:#547473 ;
    }
    .painting-join .box2 .pro-detail li {
        width: 48%;
    }
    .painting-join .box2 .pro-detail{
        flex-wrap: wrap;
    }
    .painting-join .box2 .pro-detail li{
        margin-bottom: 4%;
    }
    .same-join .box7 .top-sw{
        padding: 0;
    }
    .same-join .box7 .top-sw{
        background: none;
    }
    .login{
        margin-top: 120px;

    }
    .art-join .box1 ul{
        justify-content: space-around;
    }
    .art-join .box1 ul li{
        width: 19%;
        padding-bottom: 19%;
        height: auto;
        position: relative;
        padding-top: 0;
    }
    .art-join .box1 ul li>div{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    .art-join .box1 ul li:nth-of-type(3){
        width: 19%;
        padding-bottom: 19%;
        height: auto;
    }
    .art-join .box1 ul li span{
        display: none;
    }
    .art-join .box2 .type{
        justify-content: space-around;
    }
    .art-join .box2 .type li{
        margin: 0;
        height: auto;
        position: relative;
        padding-top: 0;
    }
    .art-join .box2 .type li>div{
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        transform: translate(-50%,-50%);
    }
    .art-join .box4 .strength .content{
        display: block;
    }
    .art-join .box4 .strength .txt{
        width: 100%;
        margin-bottom: 20px;
    }
    .art-join .box4 .pic{
        width: 100%;
    }
    .art-join .box4{
        padding: 60px 20px;
    }
    .art-join .strength .txt{
        border-radius: 25px;
    }
    .art-join .box5 .txt li{
        width: 22%;
        margin: 0;
    }
    .art-join .box5 .txt{
        justify-content: space-around;
    }
    .recruit .box1 ul{
        padding: 0 20px;
    }
    .about-us .profile .txt{
        width: 100%;
        padding: 0;
    }
    .about-us .profile{
        padding: 0 20px;
    }
    .about-us .profile .pic:before{
        display: none;
    }
    .about-us .profile .pic{
        width: 100%;
        margin-top: 30px;
        padding:0;
    }
    .about-us .culture .box1>div{
        padding: 20px;
    }
    .about-us .culture .box2{
        display: block;
    }
    .about-us .culture .box2 .txt{
        width: 100%;
    }
    .about-us .culture .box2 .txt>div{
        padding: 20px !important;
    }
    .about-us .culture .box2 .pic{
        width: 100%;
    }
    .about-us .develop .content{
        padding: 20px;
    }
    .about-us .develop .content li .tit span{
        background-size:contain ;
    }
    .certificate .swiper-slide a div{
        padding-bottom: 80%;
    }
    .certificate .swiper-slide a img{
        width: auto;
        height: 80%;
    }
    .certificate .swiper-slide{
        padding: 20px;
    }
    .about-us .honor{
        padding: 30px 20px;
    }
    .case-type-list li{display: block;}
    .case-type-list li .tit{width: 100%;background: #eee;color: #797979; padding: 8px 10px;border-radius: 0;}
    .case-type-list li>a{text-align: center;}
    .case-view h5{display: none;}
    .case-type-list li .tit i{display: inline-block;margin-left: 10px;float: right;}
    .pro-content{padding: 20px;}
}










@media screen and (max-width: 767px){
    .login .tit h1{font-size: 24px;color: #547473;}
    .login .tit h2{   color: #547473; font-size: 20px;}
    .login .tit>p {color: #797979;}
    .login-f p{font-size: 16px;margin-bottom: 10px;}
    .pro-content .txt h3{
        font-size: 16px;
        text-align: center;
    }
    .pro-content{padding: 20px;}
    .pro-content li{ flex-wrap: wrap;
    }
    .pro-content .pic{ width: 100%;
    }
    .pro-content .txt{ width: 100%;padding: 10px 0;
    }
    .pro-content .detail{ margin: 0 auto;
    }
    .pro-content li{padding: 0;}
    .pro-content li a{display: block;}
    .pro-content .detail{display: none;}
    .pro-content .pic{ padding-bottom: 60%;margin-bottom: 10px;}
    .all-case .case-list .some-list .item:last-of-type{display: none;}
    .all-case .case-list{padding: 0 10px;}
    .all-case .case-list>li{margin-bottom: 30px;}
    .pro-list .type li{width: 33.33%;flex: unset;background-size: 18px;padding-left: 28px;}
    .pro-list .type li a{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;}
    .all-case .case-list h2{font-size: 20px;}
    .case-list2 li:nth-of-type(3n+3){margin-right:unset;}
    .case-list2{padding: 0 10px;}
    .case-list2 li{width: 48%;margin-right: 4% !important;}
    .case-list2 li:nth-of-type(2n+2){margin-right: 0 !important;}
    .case-type-list li{padding:0 10px;margin-bottom: 1px;}
    
    .case-type-list li .type-detail{width: 100%;display: flex;flex-wrap: wrap;}
    .case-type-list li .type-detail a{border: 1px solid #eee;display: block;border-radius: 0;width: 33.33%;margin: 0;padding: 6px 4px;text-align: center;font-size: 14px;border-top: none;border-right: none;}
    .case-type-list li .type-detail a:nth-of-type(3n+3){border-right: 1px solid #eee;}
    .case-type-list li .type-detail a:last-of-type{border-right: 1px solid #eee;}
    .pro-list .series li{width: 33.33%;}
    .case-type-list li{border: none;}
    .case-ser { margin: 0 0 30px 0;}
    .partner ul li>div{height: auto;padding: 10px;}

    .partner{
        padding: 20px;
    }
    .partner h2{
        margin-bottom: 30px;
    }
    .all-case .case-list .ms{
        width: 100%;
        height: auto;
         top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        bottom: unset;
        background: rgba(84,116,115,0.2);
    }
    .all-case .case-list .ms p{
        padding: 6px 4%;
    }
    .all-case .case-list .big .txt{
        padding: 20px;
    }
    .all-case .case-list .big .txt h4{
        font-size: 16px;
        margin-bottom: 10px;
    }
    .all-case .case-list .some-list .item {
        width: 48%;
        margin-bottom: 4%;
    }
    .all-case .case-list .big .pic{
        padding-bottom: 60%;
    }
    .all-case .case-list .big{
        display: block;
    }
    .all-case .case-list .big .txt:before{
        display: none;
    }
    .all-case .case-list .big .pic{
        width: 100%;
    }
    .all-case .case-list .big .txt{
        width: 100%;
    }
    .all-case .case-list .big .pic img{
        width: 100%;
        height: 100%;
    }
    .about-us .base .txt>p{
        margin-bottom: 16px;
    }
    .about-us .base{
        padding: 0 20px;
        margin-bottom: 30px;
    }
    .about-us .factory{
        padding-bottom: 60%;
    }
    .about-us .factory .factory-l{
        width: 100%;
        padding: 10px
    }
    .about-us .honor{
   margin-bottom: 20px;
    }
    .certificate{
        padding-bottom: 30px;
    }
    .about-us .honor .txt>p{
        margin-bottom: 20px;
    }
    .certificate .swiper-slide a img{
        width: auto;
        height: 80%;
    }
    .certificate .swiper-slide a div{
        padding-bottom: 80%;
    }
    .about-us  .develop .content li::after{
        left: 12px;
    }
    .about-us .develop .content li p{
        padding: 10px 0 0 42px;  
        margin-bottom: 10px;   
    }
    .about-us .develop .content li .tit2 span{
        background-size:contain ;
        padding-left: 38px;
        margin-right: 16px;
    }
    .about-us .develop .content{
        padding: 10px;
    }
    .about-us .develop .content li .tit2{
        font-size: 16px;
    }

    .about-us .culture .public p{
        line-height: 1.5;

    }
    .about-us .culture .box2 .txt>div{
        padding: 10px  !important;
    }
    .about-us .culture .public h3{
        margin-bottom: 10px;
    }
    .about-us .culture .box1>div{
        padding: 10px;
    }
    .about-us .culture .box1{
        display: block;
    }
    .about-us .culture .box1>div{
        width: 100%;
    }
    .about-us .culture .tit h2{
        font-size: 22px;
    }
    .about-us .culture .tit h1 {
        font-size: 28px;
    }
    .about-us .profile .pic{
        margin:  10px 0;
    }
    .art-join .box6{
        padding: 30px 20px;
        margin-bottom: 30px;
    }
    .art-join .box7{
        padding: 0 20px;
    }
    .art-join .box6 .pic li{
        width: 48%;
        padding-bottom: 30%;
        margin-bottom:4%;
    }
    .art-join .box6 .t2 p{
        font-size: 18px;
    }
    .art-join .box6 h1{
        font-size: 20px;
    }
    .art-join .box5 .txt li{
        width: 48%;
        margin-bottom: 2%;
        text-align: left;
        padding-left: 10px;
    }
    .art-join .box5 .txt li{
       font-size: 14px;
    }
    .art-join .box5 .pic li:first-of-type{
        margin-left: 6%;
    }
    .art-join .box5 .pic li{
        width: 20%;
    }
    .art-join .box5 .pic li:last-of-type{
        margin-right: 6%;
    }
    .art-join .box5 p{
        font-size: 18px;
        width: fit-content;
        padding:12px 10px;
    }
    .art-join .box5 h1{
        font-size: 20px;
    }
    .art-join .box4 .pic p{
        font-size: 16px;
        margin-bottom: 6px;
    }
    .art-join .box4 .strength li b{
        font-size: 18px;
    }
    .art-join .box4 .strength li {
        font-size: 16px;
    }
    .art-join .strength .txt{
        border-radius: 10px;
    }
    .art-join .box4{
        padding: 30px 20px;
    }
    .art-join .box2 h1{
        font-size: 26px;
        margin-bottom: 30px;
    }
    .art-join .box2 .type li{
        width: 30%;
        padding-bottom: 30%;
    }
    .art-join .box1>p{
        font-size: 18px;
    }

    .art-join .box1>p b{
        display: block;
        font-size: 24px;
    }
    .art-join .box1 ul{
     flex-wrap: wrap;
    }
    .art-join .box1 ul li {
        width: 30%;
        padding-bottom: 30%;
    }
    .art-join .box1 ul li:nth-of-type(3) {
        width: 30%;
        padding-bottom: 30%;
    }
    .art-join .box1 ul li b{
        font-size: 24px;
    }
    .art-join .box1 ul li p{
        font-size: 14px;
    }
    .art-join .box1 h1{
        font-size: 30px;
    }
    .art-join .box1>p:nth-of-type(1){
        font-size: 18px;
    }
    .login{height: 92vh;display: flex;align-items: center;}
    .login .box1{
        width: 100%;
        height: auto;
    }
    .login .login-f{
        background: rgba(84,116,115,0.77);
    }
    .login .box1>h1{
        display: block;
        color: #547473;
        font-size: 18px ;
        text-align: center;
        margin-bottom: 20px;
    }
 
    .login .box1:after,
    .login .box1:before{
        display: none;
    }
    .login{
        margin-top: 0px;
    }
    .same-join .box7 h1{
        margin-bottom: 20px;
    }
    .painting-join .box2{
        margin-bottom: 30px;
    }
    .painting-join .box2 .txt {
        padding: 10px;
        font-size: 14px;
        text-align: justify;
    }
    .painting-join .box2 .pro-detail{
        margin-bottom: 20px;
    }
    .painting-join .box2 .pro-detail li p{
        padding: 6px 0;
        font-size: 14px;
    }
    .painting-join .box2{
        padding-top: 30px;
    }
    .painting-join .box2 .tit{
        width: auto;
    }
    .painting-join .box2 .type li a{
        padding: 12px 0;
        font-size: 14px;
    }
    .painting-join .box2 .tit li{
        width: 40%;
    }

    .painting-join .box1 ul li{
        margin-bottom: 20px;
    }
    .painting-join .box1>p{
        margin-bottom: 20px;
    }
    .painting-join .box1 ul li p{
        font-size: 14px ;
    }
    .painting-join .box1{
        background: #fff;
        padding:20px 10px;
    }
    .painting-join .box1 h1{
        font-size: 28px;
    }
    .painting-join .box1 h3{
        font-size: 18px;
        margin-bottom: 20px;
    }

    .news-detail .main .shale{
        margin-bottom: 18px;
    }
    .news-detail .main .shale p{
        font-size: 14px;
    }
    .news-detail{
        margin-bottom: 30px;
    }
    .news-detail .main .shale p span{
        margin-right: 10px;
    }
    .pro-list{
        margin-bottom: 20px;
    }
    .news-list li .pic{
        width: 40%;
    }
    .recruit{
        margin-bottom: 30px;
    }
    .recruit .box4 td{
        padding: 10px 0;
    }
    .recruit .box3{
        margin-bottom: 20px;
    }
    .recruit .box1 ul li{
        width: 32%;
    }
    .recruit .public>p{
        margin-bottom: 20px;
        padding: 0 20px;
    }
    .recruit .ss ul{
        flex-wrap: wrap;
        justify-content: center;
    }
    .recruit .ss ul li{
        width: 33.33%;
        margin-bottom: 10px;
    }
    .pro-deltail .pro-effect .swiper-slide{height: 300px;}
    .recruit .box2{
        margin-bottom: 20px;
    }
    .recruit .public h2{
        margin-bottom: 10px;
    }
    .recruit .ss ul li img{
        width: 60%;
        margin-bottom: 10px;
    }
    .recruit .public h2{
        font-size: 18px;
        background-size: contain;
    }
    input[type='radio'] + label::before{
        width: 16px;
        height: 16px;
        margin-right: 4px;
    }

    input[type='radio']:checked + label::before{
        padding: 3px;
    }
    .online-message .box1 .group h4{
        font-size: 14px;
    }
    .online-message .box1>h1{
        font-size: 18px;
        padding-left: 55px;
    }
    .online-message .box1>p{
        font-size: 14px;
        color: #494747 ;
    }
    .online-message .box2 .telphone,
    .online-message .box2 .address{
        background-size:28px;
        background-position: top left;
        border: none;
    }

    .online-message .box2 .txt>div{
        padding:0;
        padding-left: 36px;
    }
    .online-message .box2 .txt>div p{
        font-size: 18px;
        color: #547473;
    }
    .online-message .box2 .txt>div h3{
        font-size: 18px;
    }
    .pro-deltail .detail .box2{
        padding-bottom: 16px;
    }
    .pro-deltail .detail h3 span{
        font-size: 16px;
        width: 80px;
        border-radius: 8px 8px 0 0;
    }
    .pro-deltail .detail{
        padding: 0 20px !important;
    }
    .pro-deltail .detail p{
        font-size: 14px;
        margin-bottom: 16px;
    }
    .color-card ul li a p{
        color: #402001;
        font-size: 14px;
    }
    .color-card ul li{
        width: 33.33%;
        padding-bottom:33.33% ;
    }
    /*.color-card ul li:nth-of-type(n+7){*/
        /*display: none;*/
    /*}*/

    .pro-deltail .content{
        margin-bottom: 20px;
    }
    .pro-deltail .txt h3{
        font-size: 16px;
        height: 30px;
        line-height: 30px;
    }
    .pro-deltail .pro-ask:last-of-type label{
        line-height: 90px;
    }
    .pro-deltail .pro-ask textarea{
        height: 90px;
    }
    .pro-deltail .pro-ask label{
        width: 80px;
        font-size: 14px;
    }
    .pro-deltail .txt h3 span{
        font-size: 16px;
        border-radius: 8px 8px 0 0;
        width: 60px;
        margin-right: 10px;
    }
    .pro-deltail .txt h3:nth-of-type(2){
        font-size: 14px;
    }
    .pro-deltail .pic{
        margin-bottom: 20px;
    }
    .pro-deltail .txt{
        width: 100%;
        padding-left:0;
    }
    .pro-deltail .pic{
        width: 100%;
        padding-bottom: 100%;
    }
    .pro-deltail .pic img{
        height: 90%;
    }
    .pro-deltail .content{
        display: block;
        padding:  0 20px;

    }
    .head-bg .pic{
        display: none;
    }
    .head-bg .pic2{
        display: block;
        padding-bottom: 110%;
        height: auto;
    }
    .pro-list .type{
        padding:0  20px;
        margin-bottom: 20px;
    }
    .head-bg .txt h1{
        font-size: 40px;
        color: #547473;
    }
    .head-bg .txt p{
        font-size: 14px;
    }
    .head-bg{
        margin-top: 46px;
    }
    .wx-code .close-w{
        width: 20px;
        height: 20px;
    }
    .wx-code .box1 p{
        font-size: 16px;
    }
    .wx-code .box1 h2{
        font-size: 18px;
    }
    .wx-code .box1 h1{
        font-size:24px;
    }
    .msg-nav a{
        height: 70px;
    }
    footer{
        margin-bottom: 70px;
    }
    .friendship .link h3{
        font-size: 18px;
    }
    .friendship ul li a{
        font-size: 14px;
    }

    .friendship .link{
        padding-bottom: 0;
    }
    .icp .max-width-12{
        padding-top: 0;
    }
    .icp{
        padding: 0 20px;
    }
    .icp p{
        font-size: 14px;
    }
    .icp h2{
        font-size: 20px;
        margin-bottom:20px;
    }
    .join{
        padding: 40px 20px 20px 20px;
    }
    .join h1{
        font-size: 24px;
    }

    .join h2{
        font-size: 20px;
    }
    .join p{
        text-align: justify;
    }
    .join form{
        width: 100%;
    }
    .join .form-group{
        display: block;
    }
    .join input, .join textarea{
        width: 100%;
    }
    .join .form-group:last-of-type{
        display: flex;
        justify-content: center;
        margin-bottom: 0;
    }
    .join button{
        width: 120px;
        font-size: 14px;
        margin: 0 10px;
    }
    .news-center h2{
        font-size: 20px;
    }
    .news-center h1{
        font-size: 24px;
    }
    .news-center{
        padding: 30px 20px;
    }
    .advantage4{
        padding-bottom: 50px;
    }
    .advantag .swiper-pagination{
        display: block;
    }
    .swiper-pagination-bullet-active{
        background: #547473 !important;
    }
    .advantage .swiper-slide:nth-of-type(1),
    .advantage .swiper-slide:nth-of-type(2){
        margin-bottom: 0px;
    }
    .advantage .swiper-slide:nth-of-type(1) .txt, .advantage .swiper-slide:nth-of-type(2) .txt{
        height: 200px;
    }
    .advantage .swiper-slide:nth-of-type(1),
    .advantage .swiper-slide:nth-of-type(3){
        display: flex;
        flex-wrap: wrap;
        flex-direction:column-reverse;
    }
    .advantage .swiper-slide:nth-of-type(2) .pic,
    .advantage .swiper-slide:nth-of-type(2) .txt{
        width: 100%;
    }
    .advantage{
        padding: 0 20px;
    }
    .advantage .swiper-wrapper{
        display: flex;
        color: #fff;
        justify-content: unset;
        flex-wrap: unset;
        background: none;
        background-size: contain;
    }
    .advantage h1{
        font-size: 24px;
    }
    .advantage h2{
        font-size: 20px;
        margin-bottom: 20px;
    }
    .art-lacquer .box3{
        margin-bottom: 2%;
    }

    .art-lacquer .box1{
        margin-bottom:2% ;
    }
    .ext .box1{
        margin-bottom:2% ;
    }
    .art-lacquer .box3 ul{
        padding: 0;
    }
    .art-lacquer .box3 ul li{
        width: 49%;
        padding-bottom: 48%;
        position: relative;
        margin-bottom: 2%;
    }
    .art-lacquer .box3 ul li a{
        position: absolute;
        left: 0;
        top: 0;
    }

    .art-lacquer{
        padding: 0 20px;
    }
    .slide2 .pro-type h3{
        font-size: 20px;
        background-size: 32px !important;
        padding-left:40px ;
    }
    .slide1{
        margin-bottom: 20px;
    }
    .slide2 .tit{
        margin-bottom: 20px;
        padding: 0 20px;
    }
    .slide2 h2{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .slide2 h1{
        font-size: 24px;
    }
    .int .txt .more{
        margin-bottom: 10px;
    }
    .int .txt{
        padding: 20px 25px;
    }
    .int .txt h2{
        margin-bottom: 12px;
    }
    .int .txt>p{
        margin-bottom: 12px;
    }
    .slide1{
        padding: 25px;
    }
    header .hea{
        height: 46px;
    }
    .function-button a{
        display: block;
        width: 24px;
        height: 24px;
        margin: 0 10px;
    }
    .h-logo{
        width: 200px;
    }
    .banner2 {
        margin-top: 46px;
    }
    .banner2  .swiper-slide {
        padding-bottom:140% ;
    }

    .h-nav dt>a{
        font-size: 16px;
        padding: 12px 20px;
        color: #383f47;
    }
    .h-nav dl dd:nth-of-type(1){
        margin-top: 10px;
    }
    .h-nav dl dd{
        padding:6px 30px 6px 30px;
    }
    .h-nav dl dd a:before{
        left: 20px;
        width: 4px;
        height: 4px;
    }
    .h-nav .search input{
        height: 50px;
    }
    .h-nav .search{
        top: 46px;
    }
    .h-nav .search .find{
        transform: scale(0.5,0.5);
    }
    .h-nav .search h1{
        font-size: 24px;
    }
    .h-nav .search button{
        height: 50px;
        font-size: 18px;
    }
    .h-nav .search .close-2 img{
            transform: scale(0.5,0.5);
    }
    .h-nav .search .close-2 p{
        font-size: 16px;
    }
    .h-nav{
        top: 46px;
    }
    .h-nav dl dd a{
        font-size: 14px;
    }
    .nav-list{
        top: 46px;
    }
    .h-nav dl dt span{
        width: 15px;
        height: 15px;
        margin-right: 20px;
    }
    .counter{
        font-size: 30px;
    }
    .pro-content li{
        padding: 0 3%;
    }
    .pro-content .more{
        width: 80%;
    }
    .pro-content {
        padding: 0 10px ;
    }
    .news-list li .txt .cont h3{
        font-size: 16px;
    }
    .news-list li .txt {
        flex: 1;
        width: auto;
    }
    .news-list li .txt .cont{
        width: 100%;
    }
    .news-list li .txt .cont p{
        -webkit-line-clamp: 3;
        line-height: 1.5;
    }
    .news-list li .txt .time{
        background-size: 24px;
        background-position: bottom right;
    }
    .login .login-f{
        width: 86%;
        padding: 30px 20px;
    }
    .login{
        background: url("../images/login-bg02.jpg") no-repeat center center;
        background-size: cover;
    }
    .login-hide{
        display: block;
    }
    .art-join .box2 .type{
        margin-bottom: 30px;
    }
    .art-join .box3 h1{
        font-size: 30px;
        margin-bottom: 20px;
    }
    .art-join .box3{
        padding: 20px;
    }
    .art-join .box3 ul li{
        width: 48%;
        padding-bottom: 38%;
        margin-bottom: 4%;
    }
    .art-join .box3 ul li:nth-of-type(3n+3){
        width: 100%;
    }

    .art-join .box4 .max-width-12>h1{
        font-size: 20px;
    }
    .art-join .box4 .contrast li{
        position: relative;
        width: 43%;
    }
    .art-join .box4 .contrast li .pic{
        width: 100%;
    }
    .art-join .box4 .contrast li .txt{
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: rgba(0,0,0,0.3);
        height: 100%;
        padding: 10% 3% 0 3%;
    }
    .art-join .box4 .contrast li .txt p{
        color: #fff;
        text-align: center;
    }
    .art-join .box4 .contrast li .txt h3{
        color: #fff;
        margin-bottom: 4px;
    }
    .art-join .box4 .vs{
        background-size: 80%;
        width: 14%;
    }
    .art-join .box4 .contrast li .txt>div{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        width: 100%;
    }
    .art-join .box4 .strength h2{
        font-size: 22px;
        background-size: contain;
        padding-left: 42px;
        background-position:  center left ;
    }
    .art-join .box4 .strength h2:before{
        left: 36px;
    }
    .art-join .box4 .strength{
        padding: 20px 10px;
    }
    .art-join .box2{
        padding: 20px;
    }
    .art-join .box4 .strength{
        border-radius: 10px;
    }
    .about-us .pub-tit .tit{
        background-size: contain;
        padding: 12px 0 12px 24px;
        margin-bottom: 20px;
    }
    .about-us .profile .tit{
        padding: 12px 0 12px 24px;
        background-size: contain;
        margin: 0 auto;
        margin-bottom: 20px;
    }
    .about-us .profile .tit h1{
        font-size: 20px;
    }
    .about-us .pub-tit .tit h1{
        font-size: 20px;
    }
    .about-us .culture .public h3{
        font-size: 18px;
    }
    .about-us .culture .public h4{
        font-size: 18px;
    }
    .about-us .factory .factory-r{
        display: none;
    }
    .about-us .develop .content li p:before{
        left: 13px;
    }
    .about-us .develop .read-more{
        display: none;
        /* width: 140px;
        font-size: 14px;
        background: url("../images/more-down.png") no-repeat left 5px center; */
    }
    /* .about-us .develop .read-more span:nth-of-type(1){
        font-size: 14px;
    } */
    .about-us .develop{
        margin-bottom: 20px;
    }
    .about-us .honor{
        padding: 0 20px;
        padding-top: 30px;
    }
    .about-us .honor .txt>p{
        text-align: left;

    }
    .banner{
        display: none;
    }
    .banner2{
        display: block;
    }
    .history{
       display: none;
    }
    .history2{
        height: 300px;
        display: block;
     }
     .about-us .develop .content li::before{
         display: none;
     }
     .about-us .develop .content li .tit2{
         position: relative;
     }
     .about-us .develop .content li .tit2::before{
        content: "";
        width: 24px;
        height: 24px;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 3;
        /* background: #547473; */
        background: url("../images/about-us03.jpg") no-repeat center left;
        background-size: contain;
    }
    .about-us .develop .content li .tit2 h4{
        line-height: 1.5;
        font-size: 14px;
    }
    .about-us .develop .content li .tit2 span{
        font-size: 14px;
    }
    .certificate .swiper-slide a p{
        height: 40px;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .certificate .swiper-slide{
        padding: 6px;
    }
    .news-detail .go-back{
        display: block;
    }
    .news-detail .back{
        display: none;
    }
    .news-detail .main .t-page{
        display: block;
        /* margin-top: 20px; */
        padding:20px 10px ;
    }
    .news-detail .main .t-page a{
        width: 100%;
        padding: 10px 0;
        text-align: left;
    }
    .news-detail .main .t-page .go-back{
        text-align: center;
        width: 160px;
        margin: 0 auto;
        padding: 0;
        margin-top: 20px;
        padding-left: 55px;
        display: block;
    }
}







@media screen and (max-width: 414px){
    footer{
        margin-bottom: 50px;
    }
    .msg-nav{top: unset;transform: translate(0);bottom: -2px !important;}

    .msg-nav a{height: 50px; padding-top: 26px; background-position: top 5px center !important;background-size: 20px !important;display: block;}   
    .msg-nav a:last-of-type{background-position: top 9px center !important;}
   
    .art-join .box4 .contrast li .txt{
        padding-top: 4%;
    }
    .art-join .box4 .contrast li .txt p{
        font-size: 14px;
    }
    .art-join .box4 .contrast li .txt h3{
        font-size: 18px;
    }
    .art-join .box2 .type-detail li{
        width: 48%;
        height: 48%;
        margin-bottom:4%;
    }

    .art-join .box2 .type li{
        width: 32%;
        padding-bottom: 32%;
    }
    .art-join .box2 .type li b{
        font-size: 18px;
    }
    .art-join .box2 h1{
        font-size: 20px;
    }
    .news-list li.active .txt .time, .news-list li:hover .txt .time{
        background-size: 24px !important;
        background-position: bottom right !important;
    }
    .news-list li{
        margin-bottom: 10px;
    }
    .news-list li .txt{
        width: 60%;
        padding-left: 2%;
    }
    .news-list li .txt .time{
        padding-top: 12px;
    }
    .news-list li .txt .cont h3{
        font-size: 16px;
        margin-bottom: 10px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .news-list li .pic{
        width: 40%;
    }
    .news-list li .txt .cont p{
        -webkit-line-clamp: 2;
        line-height: 1.5;
    }
    .pro-list{
        margin-bottom: 20px;
    }
    .pro-content li{
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
    .pro-content .detail{
        width: 90px;
        font-size: 14px;
        border-radius: 8px;
    }
    
    .pro-content .txt p{
        line-height: 1.5;
        -webkit-line-clamp: 2;
        margin-bottom: 16px;
    }
    .pro-content .txt{
        padding: 1% 5% 0 4%;
    }
    .pro-content .pic{
        height: auto;
        padding-bottom: 100%;
        margin-bottom: 10px;
    }
    
    .pro-list .type{justify-content: flex-start;padding:10px ;}

    .h-logo{
        width: 180px;
    }
   
}